import Vue from 'vue'
import VueRouter from 'vue-router'
import Layout from '@/views/layout.vue'
import Article from '@/views/article.vue'
import Collect from '@/views/collect.vue'
import Like from '@/views/like.vue'
import User from '@/views/user.vue'
import Detail from '@/views/article-detail.vue'
import HmSon from '@/views/HmSon.vue'
Vue.use(VueRouter)

const router = new VueRouter({
  routes: [
    {
      path: '/',
      redirect: '/article',
      component: Layout, // 简写
      // components: {
      //   default: Layout,
      //   xxx: HmSon
      // },
      children: [
        {
          path: 'article',
          // 支持二种写法
          // 1：相对写法 path:'不以/开头'，它真实地址是相对于自己的父级   父级path+('/')当前的path   比如:  article===> /layout/article     拼接时如果出现// 它处处理掉一个/
          // 2：绝对写法:path是什么，最终地址就用什么（和父级无关）
          //
          // component: Article // 这里是简写
          // 下面是完整写法
          components: {
            default: Article,
            abc: HmSon
          }
        },
        {
          path: 'collect',
          // component: Collect,
          components: {
            default: Collect,
            abc: HmSon
          }
        },
        {
          path: 'like',
          component: Like
        },
        {
          path: 'user',
          component: User
        }
      ]
    },
    {
      path: '/detail',
      // alias:别名(外号)
      // alias: '/xxx',
      component: Detail
    }
  ]
})

export default router
